<template>
  <el-select
    :style="{ width: width + 'px' }"
    v-model="comValue"
    placeholder="请选择"
    @change="changeModule"
    :disabled="disabled"
  >
    <el-option
      v-for="item in moduleOptions"
      :key="item.id"
      :label="item.orgName"
      :value="item.id"
    />
  </el-select>
</template>

<!-- 社区服务站下拉组件 -->
<script setup name="serviceSiteSelect">
import { ref, reactive, onBeforeMount } from 'vue'
import { get_org_options } from '@/api/api'
import { useUserStore } from '@/pinia/modules/user'
import { useVModel } from '@vueuse/core'
// const emit = defineEmits(['change'])
const moduleOptions = ref([])
const orgInfo = useUserStore().orgInfo
const value = ref('')
const props = defineProps({
  label: {
    type: String,
    default: '社区养老服务站'
  },
  width: {
    type: String,
    default: '200'
  },
  modelValue: {
    type: String,
    default: ''
  }
})
const emit = defineEmits(['update:modelValue', 'change'])
const comValue = useVModel(props, 'modelValue', emit)
const getModule = async code => {
  const res = await get_org_options({
    pageNum: 1,
    pageSize: 99999,
    level: 5
  })
  moduleOptions.value = res.data
}
const disabled = computed(()=>{
  if(orgInfo.level == 5){
    return true
  }
  return false
})
const changeModule = val => {
  const target = moduleOptions.value.find(item => item.id === val)
  emit('change', target)
}
onBeforeMount(() => {
  // 社区账号
  if(orgInfo.level === 5){
    comValue.value = orgInfo.id
  }
  getModule()
})
</script>
<style scoped></style>
